import React, { PureComponent } from 'react';
import { Row, Col, Tabs, Modal, Select } from 'antd';
import 'moment/locale/zh-cn';
import { SecondHeaderC } from '../../../comps';
import myStyle from './index.less';
import LimitDetailTableC from '../limitDetailTable/warning';
const subNameStr = (text) => {
  let str = text;
  if (text && text.length > 10) {
    str = text.substring(0, 10) + '...';
  }
  return str;
};
export default class myModal extends PureComponent {
  state = {
    tableRolData: {},
  };

  componentDidMount() {}

  render() {
    const { record, timeStamp } = this.props;
    const dom = document.querySelector('.limitAramDetail .ant-modal-body');
    const scrollHeight = dom ? dom.offsetHeight - 290 : '100%';
    //
    return (
      <div>
        <p className={'hidden'} title={record.ruleDesc}>
          风险说明：{record.ruleDesc}
        </p>
        <Row className='ruleInfo'>
          <Col span={8} className='modal_flex'>
            <span>产品名称：</span>
            <span title={record.portfolioRootName}>{subNameStr(record.portfolioRootName)}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>组合名称：</span>
            <span title={record.portfolioName}>{subNameStr(record.portfolioName)}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>证券代码：</span>
            <span>{record.tradingCode}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>证券名称：</span>
            <span title={record.tradingName}>{subNameStr(record.tradingName)}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>方向：</span>
            <span>{record.orderSide}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>数量：</span>
            <span>{record.orderQty}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>价格(净价)：</span>
            <span>{record.price}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>价格(全价)：</span>
            <span>{record.fullPrice}</span>
          </Col>
          <Col span={8} className='modal_flex'>
            <span>金额(全价)：</span>
            <span>{record.money}</span>
          </Col>
        </Row>
        <SecondHeaderC title='明细结构' />
        <div>
          <LimitDetailTableC timeStamp={timeStamp} isRed={true} url='getWarningDetails' scrollHeight={scrollHeight} search={record} />
        </div>
      </div>
    );
  }
}
